<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>鼠标事件</title>
    <script src="打印表格(函数).js" type="text/javascript"></script>
    <style>
        div{
            height: 100px;width: 100px;background: red;
            margin: 50px;
        }
    </style>
</head>
<body>
<!--
 鼠标事件：

            onclick : 点击事件

            onmouseover : 移入事件

            onmouseout : 移出事件

            onmousemove : 移动事件

            ondblclick : 双击事件

            onmousedown: 鼠标按下

            onmouseup: 鼠标抬起-->
    <div id="box" onmouseover="a()" onmouseout="b()"></div>
    <script type="text/javascript">
        function a() {
            var box = document.getElementById("box");
            //注意这里，设置样式统一采取这种！！
            box.style.background = "green";
        }

        function b() {
            var box = document.getElementById("box");
            box.style.background = "red";
        }

    </script>



</body>
</html>